<!-- 企业中心 -->
<template>
  <div>
    <div>
      <!-- 大标题 -->
      <div class="conterer">
        <div class="imgbox">
          <span style="margin-top: 10px">企业中心</span>
        </div>
      </div>
      <!-- 内容 -->
      <div class="conterer">
        <div class="conters">
          <!-- 左侧 -->
          <el-card class="xinxibox">
            <div slot="header" class="clearfix">
              <!-- 头像 -->
              <div class="imgbox1">
                <el-avatar :size="60" @error="errorHandler">
                  <img :src="gerenlist.avatar" />
                </el-avatar>
              </div>
              <span class=" enterprise">{{ gerenlist.bodyName }}</span>
              <span class="enterprise">{{ gerenlist.phone }}</span>
            </div>
            <div class="clearfix1">
              <div>
                <el-button type="text" class="text item" @click="eor">机构认证</el-button>
              </div>
            </div>
            <div class="clearfix" v-show="this.status == 1">
              <div>
                <el-button type="text" class="text item" @click="WeiHu"><router-link to="/qiyeWeihu">企业信息维护</router-link></el-button>
              </div>
              <div v-if="this.RenZhengForm.roleId=='1'">
                <div>
                  <el-button type="text" class="text item" @click="WeiHu"><router-link to="/XuQiuFaBu">项目需求发布</router-link></el-button>
                </div>
                <div>
                  <el-button type="text" class="text item" @click="WeiHu"><router-link to="/XiangmuGuanli">项目管理</router-link></el-button>
                </div>
              </div>
              <div v-else>
                <div>
                  <el-button type="text" class="text item" @click="WeiHu"><router-link to="/PersonalNew">新闻发布</router-link></el-button>
                </div>
                <div>
                  <el-button type="text" class="text item" @click="WeiHu"><router-link to="/PersonalNews">新闻管理</router-link></el-button>
                </div>
              </div>
            </div>
          </el-card>
          <!-- 右侧 -->
          <el-card class="xianshi" v-show="disabled">
            <!-- 上部 -->
            <div slot="header" class="clearfix">
              <span>{{ gerenlist.bodyName + ':' }}</span><br />
              <span v-if="status == 0">您的信息已提交，正在审核，请耐心等待!</span>
              <span v-else-if="status == 1">您的审核已通过!</span>
              <span v-else-if="status == 2">
                <!-- 您的信息有误，请重新选择相应的身份进行信息认证!<br /> -->
                驳回原因：{{ this.bohui }}</span>
              <span v-else>您尚未完成身份认证，请选择相应的身份进行资料认证，认证通过尽享平台权益!</span>
            </div>
            <!-- 下部分 -->
            <!-- 按钮页面 -->
            <div>
              <div class="text" v-show="this.RenZheng">
                <div class="textbox">
                  <el-button type="text" class="contbox" @click="butadd(1)">
                    <div>
                      <img src="@/assets/image/qiye.png" alt="" />
                    </div>
                    <br />
                    <span>企业</span><br />
                    <span>(数据持有发)</span>
                  </el-button>
                  <el-button type="text" class="contbox" @click="butadd(2)">
                    <div>
                      <img src="@/assets/image/icon-2.png" alt="" />
                    </div>
                    <br />
                    <span>会计所</span><br />
                    <span>(会计服务提供方)</span>
                  </el-button>
                  <el-button type="text" class="contbox" @click="butadd(3)">
                    <div>
                      <img src="@/assets/image/icon-3.png" alt="" />
                    </div>
                    <br />
                    <span>律所</span><br />
                    <span>(数据合规评估方)</span>
                  </el-button>
                </div>
                <div class="textbox1">
                  <el-button type="text" class="contbox" @click="butadd(4)">
                    <div>
                      <img src="@/assets/image/icon-4.png" alt="" />
                    </div>
                    <br />
                    <span>评估所</span><br />
                    <span>(数据资产评估方)</span>
                  </el-button>
                  <el-button type="text" class="contbox" @click="butadd(5)">
                    <div>
                      <img src="@/assets/image/icon-5.png" alt="" />
                    </div>
                    <br />
                    <span>数商</span><br />
                    <span>(数据技术服务方)</span>
                  </el-button>
                  <el-button type="text" class="contbox" @click="butadd(6)">
                    <div>
                      <img src="@/assets/image/icon-6.png" alt="" />
                    </div>
                    <br />
                    <span>金融机构</span><br />
                    <span>(金融服务方)</span>
                  </el-button>
                </div>
              </div>

              <!-- 表单页 -->
              <div v-show="!this.RenZheng">
                <!-- :label-position="labelPosition" -->
                <el-form :inline="true" label-width="196px" ref="RenZhengForm" :model="RenZhengForm" :rules="rules">
                  <el-form-item label="主体名称：" prop="bodyName">
                    <el-input v-model="RenZhengForm.bodyName" autocomplete="new-password" placeholder="请输入主体名称" clearable :disabled="true"></el-input>
                  </el-form-item>
                  <el-form-item label="统一社会信用代码：" prop="unifyCreditCode">
                    <el-input v-model="RenZhengForm.unifyCreditCode" autocomplete="new-password" placeholder="请输入统一社会信用代码" clearable :disabled="true"> </el-input>
                  </el-form-item>
                  <el-form-item label="请选择所属行业：" prop="industry">
                    <el-cascader v-model="RenZhengForm.industry" :value="RenZhengForm.industry" :props="options" @change="handleChange" :placeholder="this.hangye!=''?this.hangye:'请选择所属行业'"></el-cascader>
                  </el-form-item><br />
                  <el-form-item label="请选择所属地区：" prop="businessAddress">
                    <el-cascader :value="RenZhengForm.businessAddress" v-model="RenZhengForm.businessAddress" :props="addressList" :placeholder="this.dizhi!=''?this.dizhi:'请选择所属地区'"></el-cascader>
                  </el-form-item>
                  <el-form-item label="详细地址：" class="formInput" prop="businessAddressDetail">
                    <el-input v-model="RenZhengForm.businessAddressDetail" autocomplete="new-password" placeholder="请输入详细地址" clearable></el-input>
                  </el-form-item>
                  <!-- <el-form-item label="账号管理员姓名" prop="managerName">
                    <el-input v-model="RenZhengForm.managerName" autocomplete="new-password" placeholder="请输入账号管理员姓名" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="法定代表人姓名" prop="corporateName">
                    <el-input v-model="RenZhengForm.corporateName" autocomplete="new-password" placeholder="请输入法定代表人姓名" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="账号管理员手机号" prop="phone">
                    <el-input v-model="RenZhengForm.phone" autocomplete="new-password" placeholder="请输入账号管理员手机号" clearable :disabled="true"></el-input>
                  </el-form-item>
                  <el-form-item label="经营范围" prop="businessScope">
                    <el-input v-model="RenZhengForm.businessScope" autocomplete="new-password" placeholder="请输入经营范围" clearable></el-input>
                  </el-form-item> -->
                  <el-form-item label="主营业务描述：" class="formInput" prop="mainDescription">
                    <el-input v-model="RenZhengForm.mainDescription" type="textarea" :autosize="{ minRows: 2, maxRows: 6}" placeholder="请输入主营业务描述"> </el-input>
                  </el-form-item>
                  <!-- <el-form-item label="数据业务描述" class="formInput" prop="dataDescription">
                    <el-input v-model="RenZhengForm.dataDescription" type="textarea" :autosize="{ minRows: 2, maxRows: 6}" placeholder="请输入数据业务描述"></el-input>
                  </el-form-item>
                  <el-form-item label="法人身份证类型" class="formSelect" prop="corporateIdType">
                    <el-select v-model="RenZhengForm.corporateIdType" placeholder="法人身份证类型">
                      <el-option label="身份证" :value="0"></el-option>
                      <el-option label="港澳台证件" :value="1"></el-option>
                      <el-option label="护照" :value="2"></el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="股权融资情况" class="formSelect" prop="fundingRound">
                    <el-select v-model="RenZhengForm.fundingRound" placeholder="股权融资情况">
                      <el-option label="其他" :value="0"></el-option>
                      <el-option label="天使轮" :value="1"></el-option>
                      <el-option label="A轮" :value="2"></el-option>
                      <el-option label="B轮" :value="3"></el-option>
                      <el-option label="C轮" :value="4"></el-option>
                      <el-option label="Pre-IPO" :value="5"></el-option>
                      <el-option label="已上市" :value="6"></el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="法人身份证号" prop="corporateIdNum">
                    <el-input v-model="RenZhengForm.corporateIdNum" autocomplete="new-password" placeholder="请输入法人身份证号" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="账号管理员身份证号" prop="managerIdNum">
                    <el-input v-model="RenZhengForm.managerIdNum" autocomplete="new-password" placeholder="请输入账号管理员身份证号" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="账号管理员邮箱" prop="managerEmail">
                    <el-input v-model="RenZhengForm.managerEmail" autocomplete="new-password" placeholder="请输入管理员邮箱" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="注册资本(万)" prop="capital">
                    <el-input v-model="RenZhengForm.capital" autocomplete="new-password" placeholder="请输入注册资本(万)" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="营业期限" prop="businessPeriodStart">
                    <el-date-picker v-model="RenZhengForm.businessPeriodStart" type="date" placeholder="选择日期" clearable>
                    </el-date-picker><span style="padding: 10px">至</span>
                    <el-radio v-model="RenZhengForm.businessPeriodLong" :label="0">
                      <el-date-picker v-model="RenZhengForm.businessPeriodEnd" :disabled="RenZhengForm.businessPeriodLong == 1" align="right" type="date" placeholder="选择日期" :picker-options="pickerOptions" clearable>
                      </el-date-picker></el-radio>
                    <el-radio v-model="RenZhengForm.businessPeriodLong" :label="1">长期</el-radio>
                  </el-form-item>
                  <el-form-item label="法人身份有效期" prop="corporateIdStart">
                    <el-date-picker v-model="RenZhengForm.corporateIdStart" type="date" placeholder="选择日期">
                    </el-date-picker><span style="padding: 10px">至</span>
                    <el-radio v-model="RenZhengForm.corporateIdLong" :label="0">
                      <el-date-picker v-model="RenZhengForm.corporateIdEnd" :disabled="RenZhengForm.corporateIdLong == 1" align="right" type="date" placeholder="选择日期" :picker-options="pickerOptions" clearable>
                      </el-date-picker>
                    </el-radio>
                    <el-radio v-model="RenZhengForm.corporateIdLong" :label="1">长期</el-radio>
                  </el-form-item>
                  <el-form-item label="管理员身份证有效期" prop="managerIdStart">
                    <el-date-picker v-model="RenZhengForm.managerIdStart" type="date" placeholder="选择日期">
                    </el-date-picker><span style="padding: 10px">至</span>
                    <el-radio v-model="RenZhengForm.managerIdLong" :label="0">
                      <el-date-picker v-model="RenZhengForm.managerIdEnd" :disabled="RenZhengForm.managerIdLong == 1" align="right" type="date" placeholder="选择日期" :picker-options="pickerOptions" clearable>
                      </el-date-picker></el-radio>
                    <el-radio v-model="RenZhengForm.managerIdLong" :label="1">长期</el-radio>
                  </el-form-item>
                  <el-form-item label="账号管理员身份证扫描(正):" prop="managerIdFront">
                    <ImageUpload v-model="RenZhengForm.managerIdFront"></ImageUpload>
                  </el-form-item>
                  <el-form-item label="账号管理员身份证扫描(反):" prop="managerIdBack">
                    <ImageUpload v-model="RenZhengForm.managerIdBack"></ImageUpload>
                  </el-form-item> -->
                  <el-form-item label="营业执照：" prop="businessLicense">
                    <ImageUpload v-model="RenZhengForm.businessLicense"> </ImageUpload>
                  </el-form-item>
                  <el-form-item label="相关资料上传：" prop="material">
                    <!-- <ImageUpload v-model="RenZhengForm.material" ></ImageUpload> -->
                    <up-load v-model="RenZhengForm.material" :fileList1="fileList1" v-on:fileurl="fileurl"></up-load>
                  </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer" style="float: right;">
                  <el-button @click="RenZheng = true">取 消</el-button>
                  <el-button type="primary" @click="addRenZengXinXi" v-if="status==3">提交</el-button>
                  <el-button type="warning" @click="xiugai" v-else>修改</el-button>
                </div>
              </div>
            </div>
          </el-card>
          <el-card class="xianshi" v-show="!disabled">
            <router-view></router-view>
          </el-card>
        </div>
      </div>
      <!-- 底部 -->
      <Footer></Footer>
    </div>
  </div>
</template>

<script>
import { HuoQuRenZheng, TiJiaoRenZheng, XiuGaiRenZheng, getIndustryById, address, industryName, businessAddressName } from '@/api/api'
import ImageUpload from '@/components/ImageUpload/index.vue'

export default {
  components: { ImageUpload },
  data() {
    return {
      // 经营地址列表
      addressList: {
        lazy: true,
        async lazyLoad(node, resolve) {
          const { level, value } = node
          const path = value || 0 // 这里替换为你需要的动态值

          try {
            // 发送请求获取数据，拼接路径
            const response = await address(path)
            // 检查响应数据
            // console.log('Response data:', response);
            // 整理数据
            const showData = response.data.data.map(item => ({
              value: item.code,
              label: item.name,
              leaf: level >= 2 // 假设三级级联，超过二级的节点为叶子节点
            }))
            // 注入组件需要展示的数据
            resolve(showData)
          } catch (error) {
            console.error('Error fetching address data:', error)
            // 发生错误时调用 resolve 返回空数组
            resolve([])
          }
        }
      },
      // 所属行业列表
      options: {
        lazy: true,
        async lazyLoad(node, resolve) {
          const { level, value } = node
          const path = value || 0 // 这里替换为你需要的动态值

          try {
            // 发送请求获取数据，拼接路径
            const response = await getIndustryById(path)
            // 检查响应数据
            // console.log('Response data:', response);
            // 整理数据
            const showData = response.data.data.data.map(item => ({
              value: item.categoryId,
              label: item.categoryName,
              leaf: level >= 1 // 假设三级级联，超过二级的节点为叶子节点
            }))
            // 注入组件需要展示的数据
            resolve(showData)
          } catch (error) {
            console.error('Error fetching address data:', error)
            // 发生错误时调用 resolve 返回空数组
            resolve([])
          }
        }
      },
      // 多文件上传
      fileList1: [],
      //个人信息
      gerenlist: {},
      disabled: true,
      categoryId: 0,
      code: 0,
      // 认证状态（0待审核，1审核通过，2驳回）
      status: 3,
      value: [],
      // 身份证有效期效验
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now()
        }
      },
      Wei: false,
      dialogVisible: false,
      dialogImageUrl: '',
      errorHandler: true,
      RenZheng: true,
      data: {},
      // list: {
      //   id: ''
      // },
      // 表单
      RenZhengForm: {},
      //行业回显
      hangye: '',
      //企业地址回显
      dizhi: '',
      // 表单效验
      rules: {
        businessLicense: [{ required: true, message: '请上传营业执照', trigger: 'blur' }], //营业执照
        managerIdFront: [{ required: true, message: '请上传账号管理人身份证正面照片', trigger: 'blur' }], //账号管理人身份证正面
        managerIdBack: [{ required: true, message: '请上传账号管理人身份证反面照片', trigger: 'blur' }], //账号管理人身份证反面
        material: [{ required: true, message: '请上传账号管理人授权书', trigger: 'blur' }], //账号管理人授权书
        bodyName: [{ required: true, message: '请输入主体名称', trigger: 'blur' }], // 主体名称
        unifyCreditCode: [{ required: true, message: '请输入统一社会信用代码', trigger: 'blur' }], //统一社会信用代码
        industry: [{ required: true, message: '请选择所属行业', trigger: 'blur' }], //所属行业
        businessAddress: [{ required: true, message: '请选择所属地区', trigger: 'blur' }],
        businessAddressDetail: [{ required: true, message: '请输入详细地址', trigger: 'blur' }], //详细地址
        managerName: [{ required: true, message: '请输入账号管理员姓名', trigger: 'blur' }], //账号管理员姓名
        corporateName: [{ required: true, message: '请输入法定代表人姓名', trigger: 'blur' }], //法定代表人姓名
        phone: [
          { required: true, message: '请输入账号管理员手机号', trigger: 'blur' },
          { pattern: /^1[3456789]\d{9}$/, message: '手机号码格式不正确', trigger: 'change' }
        ], //账号管理员手机号
        businessScope: [{ required: true, message: '请输入经营范围', trigger: 'blur' }], //经营范围
        mainDescription: [{ required: true, message: '请输入主营业务描述', trigger: 'blur' }], //主营业务描述
        dataDescription: [{ required: true, message: '请输入数据业务描述', trigger: 'blur' }], //数据业务描述
        corporateIdType: [{ required: true, message: '请选择法人身份证类型', trigger: 'blur' }], //法人身份证类型
        fundingRound: [{ required: true, message: '请选择股权融资情况', trigger: 'blur' }], //股权融资情况
        corporateIdNum: [
          { required: true, message: '请输入法人身份证号', trigger: 'blur' },
          {
            pattern: /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/,
            message: '证件号码格式有误！',
            trigger: 'change'
          }
        ], //法人身份证号
        managerIdNum: [
          { required: true, message: '请输入账号管理员身份证号', trigger: 'blur' },
          {
            pattern: /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/,
            message: '证件号码格式有误！',
            trigger: 'change'
          }
        ], //账号管理员身份证号
        managerEmail: [
          { required: true, message: '请输入账号管理员邮箱', trigger: 'blur' },
          { pattern: /^([a-zA-Z0-9_\-.]+)@([a-zA-Z0-9_\-.]+)\.([a-zA-Z]{2,4})$/, message: '邮箱格式不正确', trigger: 'change' }
        ], //账号管理员邮箱
        capital: [
          { required: true, message: '请输入注册资本(万)', trigger: 'blur' },
          { pattern: /^-?\d+\.?\d*$/, message: '请输入正确数据如：123', trigger: 'change' }
        ], //注册资本(万)
        businessPeriodStart: [{ required: true, message: '请输入营业期限', trigger: 'blur' }], //营业期限
        corporateIdStart: [{ required: true, message: '请输入法人身份有效期', trigger: 'blur' }], //法人身份有效期
        managerIdStart: [{ required: true, message: '请输入管理员身份证有效期', trigger: 'blur' }] //管理员身份证有效期
      },
      //未认证状态
      weirenzhegn: true,
      //驳回原因
      bohui: '',
      //角色id
      bodyId: ''
    }
  },
  computed: {},

  methods: {
    // 接收子组件传过来的值
    fileurl(fileurl) {
      // childValue就是子组件传过来的值
      this.RenZhengForm.material = fileurl
      // console.log('fu', this.RenZhengForm.material)
    },
    // 跳转表单
    butadd(bodyId) {
      this.RenZheng = false
      this.bodyId = bodyId
    },
    // 企业维护按钮跳转
    WeiHu() {
      this.disabled = false
    },
    // 机构认证跳转
    eor() {
      this.disabled = true
    },
    //获取认证信息
    huoqu() {
      HuoQuRenZheng().then(res => {
        if (res.data.data != null) {
          //获取认证状态
          this.status = res.data.data.status
          this.RenZheng = this.status !== 1
          this.RenZhengForm = res.data.data
          console.log('this.RenZhengForm', this.RenZhengForm)
          //切换卡片
          this.weirenzhegn = false
          //驳回原因
          this.bohui = res.data.data.rejectionReasons
          //认证信息返回的id
          this.RenZhengForm.id = res.data.data.id
          this.RenZhengForm.industry = res.data.data.industry.split(',')
          //行业回显
          let array = res.data.data.industry
          industryName(array.join(',')).then(results => {
            this.hangye = results.data.data.indus
          })
          //地址回显
          businessAddressName(res.data.data.businessAddress).then(results => {
            this.dizhi = results.data.data.address
          })
          this.RenZhengForm.businessAddress = res.data.data.businessAddress.split(',')

          // 获取图片列表
          if (this.RenZhengForm.material != null) {
            // console.log('this.RenZhengForm', this.RenZhengForm.material)
            this.RenZhengForm.material = this.RenZhengForm.material.split(',')
            // console.log('material>>>>>:   ', this.RenZhengForm.material)
            this.fileList1 = this.RenZhengForm.material.map(url => {
              const index = url.lastIndexOf('/')
              const name = url.substring(index + 1)
              const type = url.slice(-4)
              return { name, url, type }
            })
          }
        }
      })
    },
    //提交认证信息
    addRenZengXinXi() {
      this.RenZhengForm.roleId = this.bodyId
      // 使用箭头函数保证 `this` 的正确指向
      this.$refs.RenZhengForm.validate(valid => {
        if (valid) {
          // 避免直接修改表单数据，通过扩展运算符创建新对象
          const form = {
            ...this.RenZhengForm,
            businessAddress: this.RenZhengForm.businessAddress + '',
            industry: this.RenZhengForm.industry + '',
            material: this.RenZhengForm.material + ''
          }
          TiJiaoRenZheng(form)
            .then(res => {
              this.huoqu()
              if (res.data.code === 200) {
                this.huoqu() // 假设这是用于刷新或获取最新数据的方法
                this.$message.success('提交成功')
              } else {
                // 展示错误信息
                this.$message.error('提交失败: ' + (res.data.message || '未知错误'))
              }
            })
            .catch(error => {
              // 确保所有网络请求错误都能被捕获并给出提示
              this.$message.error('提交失败: ' + (error.message || '网络请求异常'))
            })
        } else {
          this.$message.error('请填写完整且正确的信息')
          return false // 验证不通过时阻止进一步操作
        }
      })
    },
    //修改
    xiugai() {
      this.RenZhengForm.roleId = this.bodyId
      this.$refs.RenZhengForm.validate(valid => {
        if (valid) {
          // 如果验证通过，执行提交表单的操作
          const form = {
            ...this.RenZhengForm,
            businessAddress: this.RenZhengForm.businessAddress + '',
            industry: this.RenZhengForm.industry + '',
            material: this.RenZhengForm.material + ''
          }
          XiuGaiRenZheng(form).then(res => {
            console.log(this.RenZhengForm)
            if (res.data.code == 200) {
              this.huoqu()
              this.$message({
                message: '修改成功',
                type: 'success'
              })
            } else {
              this.$message({
                message: '修改失败' + res.data.code,
                type: 'error'
              })
            }
          })
        } else {
          this.$message({
            message: '请填写完整且正确的信息',
            type: 'error'
          })
          // 如果验证不通过，阻止提交并保持表单的焦点
          return false
        }
      })
    },
    //行业
    handleChange(value) {
      this.RenZhengForm.industry = value
    },
    //企业地址
    handleChange1(value) {
      this.RenZhengForm.businessAddress = value
    }
  },
  mounted() {
    //获取本地信息
    this.gerenlist = JSON.parse(localStorage.getItem('list'))
    // console.log(this.gerenlist)
    this.RenZhengForm.bodyName = this.gerenlist.bodyName
    this.RenZhengForm.unifyCreditCode = this.gerenlist.expire
    this.RenZhengForm.phone = this.gerenlist.phone
  },
  created() {
    this.huoqu()
  }
}
</script>

<style scoped lang="less">
::v-deep .el-cascader .el-input__inner::placeholder {
  color: #606266;
  // text-align: center;
}
/* 谷歌 */
::v-deep .el-cascader .el-input__inner::-webkit-input-placeholder {
  color: #606266;
  // text-align: center;
}
/* 火狐 */
::v-deep .el-cascader .el-input__inner:-moz-placeholder {
  color: #606266;
  // text-align: center;
}
/*ie*/
::v-deep .el-cascader .el-input__inner:-ms-input-placeholder {
  color: #606266;
  // text-align: center;
}
::v-deep .formInput {
  width: 98%;

  .el-form-item__content {
    width: 74%;

    .el-input__inner {
      width: 99%;
    }

    .el-textarea__inner {
      width: 99%;
    }
  }
}

::v-deep .formSelect {
  width: 47%;

  .el-form-item__content {
    width: 48%;

    .el-input__inner {
      width: 103%;
    }
  }
}

::v-deep .el-form-item__content .FormDate {
  width: 145%;
}

// 操作样式
.textbox1 {
  margin-top: 30px;
}

.textbox,
.textbox1 {
  height: 60%;
  width: 100%;
  display: flex;
  justify-content: center;
  /*垂直居中*/
  align-items: center;

  /*水平居中*/
  .contbox {
    color: #000;
    width: 33%;
    height: 35%;

    div {
      display: flex;
      justify-content: center;
      /*垂直居中*/
      align-items: center;

      /*水平居中*/
      img {
        width: 25%;
      }
    }

    span {
      display: flex;
      justify-content: center;
      /*垂直居中*/
      align-items: center;
      /*水平居中*/
    }
  }
}

a {
  text-decoration: none;
  color: black;
}

.router-link-active {
  text-decoration: none;
  color: black;
}

.conterer {
  // height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: stretch;
}

/*  */
.conters {
  width: 1200px;
  // height: 100%;
  display: flex;
  // flex-direction: row;
  justify-content: center;
  /*垂直居中*/
  align-items: stretch;
}

.imgbox {
  background-image: url('@/assets/image/gerenzhongxin.jpg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 1915px;
  height: 250px;

  span {
    position: relative;
    left: 400px;
    top: 90px;
    color: #35445e;
    font-size: 50px;
  }
}

.bottom {
  width: 100%;
  height: 186px;
  margin-top: 50px;
  background-color: #122c7a;
  display: flex;
  justify-content: center;
  /*垂直居中*/
  align-items: center;

  /*水平居中*/
  .conterbox {
    width: 40%;
    display: flex;
    justify-content: center;
    /*垂直居中*/
    align-items: center;

    /*水平居中*/
    .box {
      width: 56%;
      color: #ffffff;
      font-size: 10px;

      img {
        width: 10%;
        height: 100%;
      }
    }

    .QRcode {
      color: #ffffff;
      width: 40%;
      border-left: 1px solid #ebeef5;
      display: flex;
      justify-content: center;
      /*垂直居中*/
      align-items: center;

      /*水平居中*/
      .qr {
        .icon {
          display: flex;
          justify-content: center;
          align-items: center;
          font-size: 12px;
        }
      }
    }
  }
}

.xianshi {
  // background-color: rgb(138, 167, 167);
  float: right;
  width: 80%;
  height: 100%;
  // box-shadow: 5px 5px 10px #5e5e5e, -5px -5px 10px #ffffff;
  margin-left: 20px;
  margin-top: 2%;
}

.xinxibox {
  // background-color: aqua;
  width: 25%;
  height: 100%;
  // box-shadow: 5px 5px 10px #5e5e5e, -5px -5px 10px #ffffff;
  margin-top: 2%;

  .tongx {
    border-radius: 50%;
    background-color: #ff0000;
    height: 80px;
    width: 80px;
  }

  .text {
    font-size: 14px;
    color: #000;
    margin-left: 50px;
  }

  .item {
    margin-bottom: 18px;
  }

  .clearfix {
    color: #35445e;

    .imgbox1 {
      display: flex;
      justify-content: center;
      /*垂直居中*/
      align-items: center;
      /*水平居中*/
    }

    .enterprise {
      display: flex;
      justify-content: center; //水平
      align-items: center; //垂直
    }
  }

  .clearfix1 {
    border-bottom: 1px solid #ebeef5;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: '';
  }

  .clearfix:after {
    clear: both;
  }
}
</style>
async lazyLoad(node, resolve) {
  const { level, value } = node;
  let path = value || '0'; // 默认路径为 '0'

  // 安全性验证和清理
  if (!/^\d+$/.test(path)) {
    console.error('Invalid path:', path);
    return resolve([]);
  }

  try {
    // 发送请求获取数据，拼接路径
    const response = await address(path);

    // 检查响应状态码
    if (!response.ok) {
      console.error(`Request failed with status ${response.status}: ${response.statusText}`);
      return resolve([]);
    }

    // 检查响应数据是否存在
    const responseData = response.data?.data || [];
    if (!Array.isArray(responseData)) {
      console.error('Unexpected response data format:', responseData);
      return resolve([]);
    }

    // 整理数据
    const showData = responseData.map(item => ({
      value: item.code,
      label: item.name,
      leaf: level >= MAX_LEVEL // 使用配置项管理级联层级
    }));

    // 注入组件需要展示的数据
    resolve(showData);
  } catch (error) {
    console.error('Error fetching address data:', error, { path });
    // 发生错误时调用 resolve 返回空数组
    resolve([]);
  }
}

// 配置项
const MAX_LEVEL = 2; // 根据业务需求调整